<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <meta name="csrf_token" id="token" content="{{ csrf_token() }}">
    @include('public.h5_head')
    <title>确认订单</title>
    <script src="{{ env('CDN_DOMAIN_NAME') }}/js/commonjs/rem.js"></script>
    <link rel="stylesheet" type="text/css" href="{{ env('CDN_DOMAIN_NAME') }}/css/commoncss/common.css"/>
    <link rel="stylesheet" type="text/css" href="{{ env('CDN_DOMAIN_NAME') }}/css/order.css"/>
</head>
<script src="{{ env('CDN_DOMAIN_NAME') }}/js/app.js"></script>
<script src="{{ env('CDN_DOMAIN_NAME') }}/js/commonjs/iscroll.js"></script>
<script src="{{ env('CDN_DOMAIN_NAME') }}/js/commonjs/common.js"></script>
<script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak=oqyBjKGM57Maq2jDr64qx637kMd1wb4S"></script>
<style>
    #allmap {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微软雅黑";}
</style>
<body>
<div id="box_nopay">
    @if(isset($area))
        <div class="nopay_head" >
        <div class="head_top">
            <img src="/img/00005.png" alt="" />
            <div class="head_name">收货人：<span class="user_name">{{ $area->user_name }}</span></div>
            <div class="head_tel user_tel">{{ Auth::user()->user_tel }}</div>
        </div>
        <div class="head_bottom">
            <span>收货地址：</span>
            <p class="head_address user_address">{{$area->user_area }} &nbsp; {{ $area->user_areadetails }}</p>
        </div>
    </div>
        @else
        <div class="nopay_head">
            无默认地址 <br>
            <a href="/center/user-areas?type={{ $pro->pro_id }}">去创建?</a>
        </div>
    @endif
        <div class="onpay_hint">您所在控区有 {{ $areaUserCount }} 家店铺，恭喜您抢单成功!</div>
        <div class="onpay_map" id="allmap">

        </div>
    <div class="onpay_title">
        <img src="/img/00004.png" alt="" />
        <span>{{ $pro->brand }}</span>
    </div>
    <div class="wrap">
        <div class="main_nopay">
            <div class="onpay_product">
                <div class="onpay_list">
                    <div class="onpay_list_l">
                        <img src="{{ env('CDN_DOMAIN_NAME') }}/upload/{{ $pro->img }}" alt="" class="onpay_list_img" />
                    </div>
                    <div class="onpay_list_c">
                        <p class="onpay_list_words"> {{ $pro->title }}</p>
                        <p class="onpay_list_words">款号：{{ $pro->girard }}</p>
                        <p class="onpay_list_words">颜色：{{ $pro->color }}</p>
                    </div>
                    <div class="nopay_list_r">
                        <div class="nopay_money">￥<b>{{ sprintf("%.2f",$pro->actual_price/$pro->num) }}</b></div>
                        <div class="nopay_num">×<em>{{ $pro->num }}</em></div>
                    </div>
                    <div class="nopay_sum">合计:<i style="margin-left:0.5rem;">￥<b>{{ sprintf("%.2f",$pro->actual_price) }}</b></i></div>
 				</div>
 			</div>
 			<div class="nopay_discount">
                @if(Auth::user()->postage_bean < 0)
                <div class="nopay_order">
                    <p class="postage_p">未付邮费:<span class="postage" style="margin-left:0.5rem;">{{ sprintf("%.2f",Auth::user()->postage_bean) }}</span></p>
                </div>
                @elseif(Auth::user()->postage_bean == 0)
                    <div class="nopay_order">
                        <p class="postage_p">未付邮费:<span class="postage" style="margin-left:0.5rem;">N/A</span></p>
                    </div>
                @endif
                <div class="nopay_order">
                	<p class="order_choose">
                    @if($pro->status != 0)
                        @if($pro->is_owe == 0)

                        @else
                            <img src="/img/00012.png"/>
                            <span class="account">赊账<em class="em"></em></span>
                        @endif
                    @else
                       <img class="choose_img" src="/img/00014.png"/>
                       <span class="account">赊账<em class="em"></em></span>
                    @endif
					</p>
                	<p class="order_p" style="color:#EA294B;"><span style="color:#383838;margin-right:0.5rem;">实际付款:</span><span class="actual">￥
                            @if($pro->is_owe == 0)
                            {{ sprintf("%.2f",$pro->total_price) }}
                                @else
                                {{ sprintf("%.2f",$pro->downpayment) }}
                            @endif
                        </span></p>
                </div>
            </div>
            <div class="order_kong"></div>
        </div>
    </div>
    <div class="nopay_submit">
        <div class="sub_l">
            <span>总计:</span>
            <i class="sub_total">￥
                @if($pro->is_owe == 0)
                    {{ sprintf("%.2f",$pro->total_price + $pro->postage_owe)  }}
                @else
                    {{ sprintf("%.2f",$pro->downpayment + $pro->postage_owe) }}
                @endif</i>
        </div>
        <div class="sub_r">
            @if($pro->status == 0)
            <a href="javascript:;" id="userOrderPay" >确认订单</a>
            @else
                <a href="javascript:;" id="userOrderPay" >继续支付</a>
            @endif
        </div>
    </div>
    <div class="nopay_mask" style="display:none;"></div>
	<div class="nopay_debt" style="display:none;">
		<div class="nopay_div">
			<div class="hint_tit">赊账详情</div>
			<p class="hint_p">
				<span class="hint_sp">首付金额:</span>
				<span class="hint_number">￥{{ $pro->actual_price * $area->first_pro }}</span>
			</p>
            <p class="hint_p">
                <span class="hint_sp">首付比例:</span>
                <span class="hint_number">{{ $area->first_pro*100  }}%</span>
            </p>
			<div class="hint_notice">注:如有疑问，可点此查看赊账规则详情<em class="nopay_notice" onclick="window.location.href='/user/explain'"></em></div>
		</div>				
		<div class="nopay_know">我知道了</div>
	</div>
    <div class="nopay_over" style="display:none;">
        <p class="nopay_pass"></p>
        <p class="nopay_ok">确定</p>
    </div>
</div>

</body>
<script>
	/*赊账*/
    $(document).on("click",".account",function(){
		$(".nopay_mask").show();
		$(".nopay_debt").show();
	})
	$(".nopay_know").click(function(){
		$(".nopay_mask").hide();
		$(".nopay_debt").hide();
	})
	//点击圈选中选不中
    var is_owe = 0;
	$(".choose_img").click(function(){
        if('{{ $area->first_pro }}'==1){
            $(".nopay_pass").text("您的信用额度不足以赊账")
            $(".nopay_over").show();
            $(".nopay_mask").show();
        }else{
            if($(this).attr('src') == '/img/00014.png'){
                is_owe = 1;
                var price  = '{{ sprintf("%.2f",$pro->actual_price * $area->first_pro + ($pro->total_price - $pro->actual_price)) }}'
                $(".actual").text("￥ "+price);
                $(".sub_total").text("￥ "+price);
                $(this).attr('src','/img/00012.png')
            }else{
                is_owe = 0;
                var price = '{{ sprintf("%.2f",$pro->total_price) }}'
                $(".actual").text("￥ "+price);
                $(".sub_total").text("￥ "+price);
                $(this).attr('src','/img/00014.png')
            }
        }
	})				
    scroll();
    $(document).on("click","#userOrderPay",function(){
//    $('#userOrderPay').click(function () {
//            var url = is_vip();
        var order_id = '{{ $pro->pro_id }}';
        var total_price = '{{ $pro->actual_price }}';
        var addressee_name = $('.user_name').text();
        var addressee_tel = $('.user_tel').text();
        var addressee_place = $('.user_address').text();
        if(addressee_name && addressee_place && addressee_tel)
        {
            $.ajax({
                url:'/userOrderPay',
                type:'POST',
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf_token"]').attr('content')
                },
                data:{id:order_id,total_price:total_price,addressee_name:addressee_name,addressee_tel:addressee_tel,addressee_place:addressee_place,status:1,is_owe:is_owe},
                dataType:'json',
                success:function(data){
                    console.log(data);
                    if(data.success == true) {
                        if('{{$pro->status}}'==0){
                            if(is_owe==0){
                                $(".order_choose").hide();
                                $("#userOrderPay").text("继续支付")
                            }else{
                                $(".order_choose").empty();
                                $(".order_choose").append("<img src='/img/00012.png' /><span class='account'>赊账<em class='em'></em></span>")
                                $("#userOrderPay").text("继续支付")
                            }
                        }

                        window.location.href = '/wecCode?ordernum={{ $pro->order_num }}&subject={{ $pro->title }}';
                    }else{
                        $(".nopay_pass").text(data.msg)
                        $(".nopay_over").show();
                        $(".nopay_mask").show();
                    }
                }
            })
        }else {
            $(".nopay_pass").text("请完善收件信息")
            $(".nopay_over").show();
            $(".nopay_mask").show();
        }

    });
    //点击确定隐藏
    $(".nopay_ok").click(function(){
        $(".nopay_over").hide();
        $(".nopay_mask").hide();
    })

    function user_set_area() {
        window.location.href = '/center/user-areas?type={{ $pro->pro_id }}';
    }

    // 百度地图API功能
    var map = new BMap.Map("allmap");

    var myGeo = new BMap.Geocoder();
//     将地址解析结果显示在地图上,并调整地图视野
//    myGeo.getPoint("杭州市江干区金沙大道377号", function(point){
//        console.log(point);
//        if (point) {
//            map.centerAndZoom(point, 16);
//            map.addOverlay(new BMap.Marker(point));
//        }
//    }, "杭州市");

    var lists = [
            @foreach($points as $point)
        [{{ $point->lng }},{{ $point->lat }}],
            @endforeach
        [-1,0]
    ];


    map.centerAndZoom(new BMap.Point('{{ $area->lng }}','{{ $area->lat }}'), 12);
    var local = new BMap.LocalSearch(map, {
        renderOptions:{map: map, autoViewport:true}
    });
    var points = [new BMap.Point('{{ $area->lng }}', '{{ $area->lat }}')];


    var options = {
        size: BMAP_POINT_SIZE_BIG,
        shape: BMAP_POINT_SHAPE_STAR,
        color: 'red'
    };
    var pointCollection = new BMap.PointCollection(points, options);
    map.addOverlay(pointCollection);


    var otherpoints = [];
    for(var i = 0; i< lists.length; i++)
    {
        if(lists[i][0] > 0)
            otherpoints.push(new BMap.Point(lists[i][0],lists[i][1]));
    }
    var otherstyle = {
        size: BMAP_POINT_SIZE_SMALL,
        shape: BMAP_POINT_SHAPE_CIRCLE	,
        color: 'blue'
    };
    var otherPointCollection = new BMap.PointCollection(otherpoints, otherstyle);
    map.addOverlay(otherPointCollection);
</script>
</html>

